<template>
	<div id="head">
		<!-- <p @click="userInfo()">返回</p> -->
		<van-nav-bar title="足迹" left-text="返回" left-arrow right-text="删除" @click-left="onClickLeft()"
			@click-right="deleteFootprint()" />
		<!-- <h2>足迹</h2> -->
	</div>
	<div class="context" v-for="(item,index) in myFootprint" :key="index">
		<input class="checkboc" name="checkboc" type="checkbox" v-model="item.selected" />
		<div id="img">
			<img :src="item.shop.headPortrait" width="80" height="80" />
		</div>
		<div id="info" @click="getDishes(item.shop.id)">
			<h3 class="h3" v-text="item.shop.shopName"></h3>
			<el-rate v-model="item.shop.grade" disabled text-color="#ff9900" /><br />
			<span v-text="item.shop.shopType"></span>
		</div>
		<!-- <template #right>
			<van-button square text="删除" type="danger" class="delete-button" />
		</template> -->

	</div>
	<van-empty class="tishi" v-if="myFootprint == 0" description="空空如也" />

</template>

<script scoped>
	import {
		ElMessage
	} from 'element-plus';
	import qs from 'qs';
	// import {
	// 	createApp
	// } from 'vue';
	// import {
	// 	Empty
	// } from 'vant';


	// import { ArrowLeftBold } from '@element-plus/icons'
	export default {
		//返回上一个页面
		// setup() {
		// 	const onClickLeft = () => history.back();
		// 	return {
		// 		onClickLeft,
		// 	};
		// },
		data() {
			return {
				myFootprint: [],
			}
		},
		mounted() {
			this.getMyFootprint()

		},
		methods: {
			//查询足迹列表
			getMyFootprint() {
				this.$route.userId = this.userId
				this.$axios.get('/footprint/getMyFootprint')
					.then(res => {

						this.myFootprint = res.result.list
						this.myFootprint.forEach(item => {
							item.selected = false;
						})
						console.log("userId:" + res.result.list[0].userId)
					})
			},
			//跳转店铺菜品列表
			getDishes(shopId) {
				this.$router.push({
					path: '/dishesDetails',
					query: {
						'id': shopId
					}
				})
			},
			//删除
			deleteFootprint() {
				let allSelected = [];
				this.myFootprint.forEach(item => {
					if (item.selected) {
						allSelected.push(item.id);
					}
				})
				console.log(allSelected);
				qs
				this.$axios.post("/footprint/deleteFootprint", allSelected)
					.then(res => {
						console.log("删除判断:" + res.result.judge)
						if (res.result.judge) {
							ElMessage({
								message: '删除成功。',
								type: 'success',
							})
							this.getMyFootprint()
						} else {
							ElMessage({
								message: '删除失败。',
								type: 'error',
							})
						}

					})
			},
			onClickLeft() {
				history.back();
			}


		}
	}
</script>
<style scoped>
	.tishi {
		padding-top: 200px;
	}

	.context {
		display: flex;
		padding: 10px 0px;
		margin: 0px 15px;
		border-bottom: 1px solid black;
	}

	.h3 {
		line-height: 15px;
		margin: 5px 0px;
		font-size: 16px;
	}

	#info {
		padding-left: 15px
	}

	#head {
		/* background-color: #ffc300; */

		/* padding: 5px 15px;
			display: flex;
			align-items: center */
	}

	/* #head>h2 {
			padding-left: 125px;
		} */

	.van-nav-bar__content {
		height: 70px;
		background-color: #ffc300;
	}

	.checkboc {
		margin: 0px 10px;
		margin-top: 35px;
	}
</style>
